<template>
  <div class="article-block">
    <div class="page-content-block">
      <div class="page-nav">
        <div class="nav-item" v-for="(item,index) in pageNav" @click="clickNav(index)" v-if="pageNav.length>0">
          <span :style="{color:index == pageNav.length-1?'#368EE0':'#333333'}">{{ item.name }}</span>
          <span style="margin: 5px" v-if="index !== pageNav.length-1">></span>
        </div>
      </div>

      <div class="article-content">
        <div class="article-title">{{ data.title }}</div>
        <div class="article-date">发布日期:{{ dayjs(data.deploydate).format("YYYY-MM-DD") }} 访问次数：{{ data.asknum }}</div>
        <div class="article-enclosure">
          附件：
          <div class="enclosure-list">
            <div class="enclosure-item" v-for="item in 4">以学评教的课堂教学评价指标设计2.pdf</div>
          </div>
        </div>
        <div class="article-info" v-html="data.content"></div>
      </div>
    </div>
    <float-block :main-list="extra" :style="{'margin-top':pageNav.length> 0 ?'35px':'15px'}"></float-block>
  </div>
</template>

<script>
import FloatBlock from '../../components/float-block/float-block'
import {getInfo} from "@/api/content";
import dayjs from "dayjs";

export default {
  name: "article-block",
  components: {
    FloatBlock
  },
  watch: {
    '$route.query.sno': function () {
      this.getData()
    }
  },
  data() {
    return {
      dayjs,
      data: {},
      extra: [],
      pageNav: []
    }
  },
  created() {
    this.getData()
    // let list = this.$utils.decodeURIAndParse(this.$route.query.pageInfo);
    // this.pageNav = list;


  },
  methods: {
    getData() {
      let sno = this.$route.query.sno;
      if (sno) {
        getInfo(sno).then(res => {
          this.data = res.data
          this.extra = res.extra
        })
      }
    },

    /**
     * 点击路由跳转
     * @param index
     */
    clickNav(index) {
      if (index !== (this.pageNav.length - 1)) {
        this.$router.push({name: this.pageNav[index].type})
      }
    }
  }
}
</script>

<style lang="scss" src="./index.scss" scoped>

</style>
